<template>
  <rx-dialog @handOk="handleSubmit" @cancel="cancel">
    <rx-layout>
      <div slot="center">
        <a-form :form="form">
          <a-form-item style="display:none">
            <a-input v-decorator="['id']"/>
            <a-input v-decorator="['type']"/>
            <a-input v-decorator="['treeId']"/>
            <a-input v-decorator="['treeName']"/>
            <a-input v-decorator="['enable']"/>
          </a-form-item>
          <a-form-item :labelCol="labelCol1" :wrapperCol="wrapperCol1" :label="i18n('form.name','权限名称')">
            <a-input :placeholder="i18n('form.name','权限名称')" v-decorator="['name', {rules: [{required: true, message: i18n('form.name','权限名称','input')}]}]"/>
          </a-form-item>
          <a-form-item :labelCol="labelCol1" :wrapperCol="wrapperCol1" :label="i18n('auth.authConfig','权限配置')">
            <rx-grid
              ref="authRight"
              :columns="columns"
              :bordered="true"
              :showPage="false"
              :dataSource="authRightData"
              style="height:300px;"
            >
          <span slot="setting" slot-scope="{text,record,index,blur}"
                @click="editRecord(record,index,'setting',blur)">
          {{record.settingName}}
          </span>
            </rx-grid>
          </a-form-item>
        </a-form>
      </div>
    </rx-layout>
  </rx-dialog>
</template>
<script>
  import SysAuthSettingApi from '@/api/system/core/sysAuthSetting'
  import {BaseForm,RxDialog,RxGrid,RxLayout,Util} from "@lowcode/jpaas-common-lib";
  import authSettings from '@/api/system/core/authSetting';
  import DialogBox from '@/assets/js/DialogBox';
  export default {
    name: 'SysAuthSettingTreeEdit',
    mixins:[BaseForm],
    props:["curRow"],
    components: {
      RxDialog,
      RxGrid,
      RxLayout
    },
    data(){
      return {
        columns:[
          {title: this.i18n('auth.permission','权限'), dataIndex: 'type',displayField:'typeName',scopedSlots: {customRender: 'type'}, width: 100},
          {title: this.$ti18('rxList.config','配置'), dataIndex: 'setting', scopedSlots: {customRender: 'setting'}, width: 100}
        ],
        authRightData:[]
      }
    },
    methods: {
      i18n(name,text,key){
          return this.$ti18(name,text,"SysAuthSetting",key);
      },
      onload_(data){
        if(!data){
          this.mdl = Object.assign({
            type:this.curRow.catKey,
            treeId:this.curRow.treeId,
            treeName:this.curRow.oriName || this.curRow.name,
            enable:true
          });
          this.form.setFieldsValue(this.mdl);
        }
        this.authRightData=Util.deepClone(authSettings.getByType(this.curRow.catKey));
      },
      get(id){
        return SysAuthSettingApi.get(id);
      },
      save(values){
        values.rightJson=JSON.stringify(this.$refs.authRight.getData());
        return SysAuthSettingApi.saveConfigJson(values);
      },
      editRecord(record,index,type){
        if(!record[type]) return;
        DialogBox.openPermissionUser(this,record[type],function(self_,data){
          self_.setChangeValue(index,type,data,record);
        });
      },
      setChangeValue(index,type,data,record){
        var parents=this.$refs.authRight.findRows(function(data){
          if(data['id']==record['parentId'])return true;
        })
        var target;
        if(parents.length>0){
          target = parents[0].children[index];
        }else{
          target = record;
        }
        if (target) {
          target[type]=data.value;
          target[type+'Name']=data.label;
        }
      }
    }
  }
</script>
